<!DOCTYPE html>
<html>
<head>
	<!-- 设置浏览器不缓存 -->
    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="0">
	<!-- Content-Type -->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<!-- Favicon -->
	<link rel="shortcut icon" href="./images/logo.png">
	<title>企业服务共享中心</title>
	<!--stylesheets-->
	<link rel="stylesheet" href="./plugins/element/index.css">
	<script src="./plugins/vue/vue.js"></script>
	<script src="./plugins/element/index.js"></script>
	<script src="./plugins/axios/axios.min.js"></script>
	<script src="./js/common/public.js?v=0.8.0.3"></script>
	<!-- 自定义样式表 -->
	<link rel="stylesheet" href="./css/base.css?v=0.8.0.3">
</head>
<body>
<div id="app">
<template>
<el-container class="maincontainer">
	<el-container class="submaincontainer">
		<el-card class="box-card" style="position:relative;width:330px" shadow="never" v-show="leftbar_show">
		  <div style="position:absolute;left:0;top:0;right:0;bottom:0;overflow-y:auto;overflow-x:hidden;padding-left: 20px;padding-top: 20px;padding-right: 20px;">
			<el-form :model="queryForm" ref="queryForm" >
					<el-radio-group v-model="queryForm.outdate"  @change="outdateChange">
						<el-form-item label="过期捡漏" prop="outdate" >
						  <el-radio label="不捡漏" >不捡漏</el-radio>
						  <el-radio label="捡漏" >捡漏</el-radio>
						</el-form-item>
					</el-radio-group>
					<el-form-item label="关键字" prop="keyword"  maxlength="20" autocomplete="off"  >
					  <el-input v-model="queryForm.keyword">
					  </el-input>
					</el-form-item>
					<el-checkbox-group v-model="queryForm.saletype" >
						<el-form-item label="客户类别" prop="saletype">
						  <el-checkbox label="A">A</el-checkbox>
						  <el-checkbox label="B">B</el-checkbox>
						  <el-checkbox label="C">C</el-checkbox>
						  <el-checkbox label="无" >无</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-checkbox-group v-model="queryForm.assignetype" >
						<el-form-item label="分配方式" prop="assignetype">
						  <el-checkbox label="自动">自动</el-checkbox>
						  <el-checkbox label="手动">手动</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-checkbox-group v-model="queryForm.src" >
						<el-form-item label="客户来源" prop="src" >
						  <el-checkbox label="线索">线索</el-checkbox>
						  <el-checkbox label="工商">工商</el-checkbox>
						  <el-checkbox label="渠道">渠道</el-checkbox>
						  <el-checkbox label="其他">其他</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-checkbox-group v-model="queryForm.signtype" >
						<el-form-item label="签约方式" prop="signtype">
						  <el-checkbox label="新签">新签</el-checkbox>
						  <el-checkbox label="续签">续签</el-checkbox>
						  <el-checkbox label="转介绍">转介绍</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-checkbox-group v-model="queryForm.weixin" >
						<el-form-item label="微信" prop="weixin">
						  <el-checkbox label="未添加">未添加</el-checkbox>
						  <el-checkbox label="已添加">已添加</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-form-item label="跟踪者" prop="tracker">
						<el-select v-model="queryForm.tracker" multiple placeholder="请选择" filterable >
						  <el-option
							v-for="item in members"
							:key="item.id"
							:label="item.name"
							:value="item.id">
						  </el-option>
						</el-select>
					</el-form-item>
				<div v-if="queryForm.outdate != '捡漏'">
					<el-checkbox-group v-model="queryForm.status" >
						<el-form-item label="状态" prop="status">
						  <el-checkbox label="已签约">已签约</el-checkbox>
						  <el-checkbox label="未签约">未签约</el-checkbox>
						  <el-checkbox label="已面访">已面访</el-checkbox>
						  <el-checkbox label="已跟踪">已跟踪</el-checkbox>
						  <el-checkbox label="已流转">已流转</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
				</div>
					<el-form-item label="添加日期" prop="datetime" >
						<el-date-picker style="width:235px"
							value-format="yyyy-MM-dd"
							  v-model="queryForm.datetime"
							  type="daterange"
							  width="100"
							  align="right"
							  unlink-panels
							  range-separator="至"
							  start-placeholder="开始日期"
							  end-placeholder="结束日期"
							  :picker-options="pickerOptions" >
						</el-date-picker>
					</el-form-item>
					<el-form-item label="跟踪日期" prop="updatetime" >
						<el-date-picker style="width:235px"
							value-format="yyyy-MM-dd"
							  v-model="queryForm.updatetime"
							  type="daterange"
							  width="100"
							  align="right"
							  unlink-panels
							  range-separator="至"
							  start-placeholder="开始日期"
							  end-placeholder="结束日期"
							  :picker-options="pickerOptions">
						</el-date-picker>
					</el-form-item>
				<el-form-item>
				<el-button size="small" type="primary" @click.native.prevent="start" style="position:fixed;left:20px;bottom:5px;">查询</el-button>
			  </el-form-item>

			</el-form>
		  </div>
		</el-card>
		<el-card class="box-card" style="width:100%" shadow="never">
		  <div slot="header" class="clearfix">
		  <i v-on:click="showLeftBar()" v-bind:class="[leftbar_show ? 'el-icon-s-fold' : 'el-icon-s-unfold']" style="color:#409EFF;cursor:pointer;"></i>
			<span>客户列表</span>
			<el-button-group style="float: right;margin-top:0px;">
				  <el-button size="small" icon="el-icon-document-add" :disabled="queryForm.outdate == '捡漏'" type="primary" @click="toolAction('添加')">添加</el-button>
				  <el-button size="small" icon="el-icon-document-copy" :disabled="queryForm.outdate == '捡漏'"  @click="toolAction('批量添加')">批量添加</el-button>
				  <el-button size="small" icon="el-icon-s-grid" :disabled="queryForm.outdate == '捡漏'" @click="toolAction('批量分类')">批量分类</el-button>
				  <el-button size="small" icon="el-icon-share" :disabled="queryForm.outdate == '捡漏'"  @click="toolAction('批量跟踪')">批量跟踪</el-button>
				  <el-button size="small" icon="el-icon-finished" :disabled="queryForm.outdate == '捡漏'"  @click="toolAction('转移')">转移</el-button>
				  <el-button size="small" icon="el-icon-view"  :disabled="queryForm.outdate != '捡漏'" @click="toolAction('捡漏')">捡漏</el-button>
			</el-button-group>
		  </div>
		  <div>
			  <el-table
			row-key="id"
			  border
				ref="multipleTable"
				@select='selectionChange'
				:data="pagedata"
				tooltip-effect="dark"
				:height="tableHeight"
				style="width: 100%;"
				@selection-change="handleSelectionChange">
				<el-table-column
				  type="selection"
				  min-width="55">
				</el-table-column>
				<el-table-column type="expand">
				  <template slot-scope="props">
					<el-form v-for="rec in props.row.recs" label-position="left" >
					  <el-form-item :label="'日期:'+rec.createtime" label-width="300">
						<span>事项:{{rec.tracktype}}</span>
						<span>跟踪内容:{{rec.content}}</span>
					  </el-form-item>
					</el-form>
				  </template>
				</el-table-column>
				<el-table-column
				v-for="column in tablecolums"
				  v-bind:prop="column.prop"
				  v-bind:label="column.label"
				  v-bind:min-width="column.width"
				  show-overflow-tooltip>
				</el-table-column>
				<el-table-column label="操作" min-width="50" >
				  <template slot-scope="scope">
					  <el-link type="primary" v-show="scope.row.status!='已释放' && queryForm.outdate != '捡漏'" @click="edit(scope.$index, scope.row)">编辑</el-link>
					  <el-link type="primary" v-show="scope.row.status=='已签约' && queryForm.outdate != '捡漏'" @click="transFormDialogShow(scope.$index, scope.row)">流转</el-link>
				  </template>
				</el-table-column>
			  </el-table>
			  <div style="margin-top: 20px">
			  
				<el-pagination
				@size-change="handleSizeChange"
				@current-change="handleCurrentPageChange"
				:current-page="queryForm.pageNo"
				:page-sizes="queryForm.pagesizes"
				  :page-size="queryForm.pagesize"
				  background
				  layout="total,sizes, prev, pager, next"
				  :total="pagetotal">
				</el-pagination>
			  </div>			  
		  </div>
		</el-card>
	</el-container>
</el-container>
<el-dialog :close-on-click-modal="false"  title="客户信息" :visible.sync="dialogFormVisible" width="600px">
    <el-form :model="mycusForm" :rules="mycusRules" ref="mycusForm" label-width="80px">
		<el-row :gutter="20">
		  <el-col :span="16">
			  <el-form-item label="公司名称" prop="name"  >
				  <el-input v-model="mycusForm.name" maxlength="50"></el-input>
			  </el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="12">
			  <el-form-item label="法人" prop="legalperson"  >
				  <el-input v-model="mycusForm.legalperson" maxlength="20"></el-input>
			  </el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="12">
			  <el-form-item label="联系人" prop="contacter"  >
				  <el-input v-model="mycusForm.contacter" maxlength="20"></el-input>
			  </el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="12">
			<el-form-item label="联系电话" prop="phone">
				<el-input v-model="mycusForm.phone"  maxlength="20"></el-input>
			</el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="10">
			<el-form-item label="区域" prop="area">
				<!-- <el-input v-model="mycusForm.area"  maxlength="50"></el-input> -->
				<el-select v-model="mycusForm.area" filterable >
					  <el-option
						v-for="item in areas"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
			</el-form-item>
		  </el-col>
		  <el-col :span="10">
			<el-button type="primary" icon="el-icon-edit" circle size="small" @click="addAreaDailogOpen"></el-button>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="20">
			<el-form-item label="地址" prop="address">
				<el-input v-model="mycusForm.address"  maxlength="100"></el-input>
			</el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			<el-radio-group v-model="mycusForm.saletype">
				<el-form-item label="客户类别" prop="saletype">
				  <el-radio label="A">A</el-radio>
				  <el-radio label="B">B</el-radio>
				  <el-radio label="C">C</el-radio>
				  <el-radio label="无">无</el-radio>
				</el-form-item>
			</el-radio-group>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			<el-radio-group v-model="mycusForm.weixin">
				<el-form-item label="微信" prop="weixin">
				  <el-radio label="已添加">已添加</el-radio>
				  <el-radio label="未添加">未添加</el-radio>
				</el-form-item>
			</el-radio-group>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="24">
				<el-form-item label="跟踪者" prop="trackerid">
				<el-select :disabled="action == 'edit'" v-model="mycusForm.trackerid" @change="trackerChange" filterable>
				  <el-option
					v-for="item in users"
					:key="item.id"
					:label="item.name"
					:value="item.id">
				  </el-option>
				</el-select>
				</el-form-item>
			<el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="24">
				<el-radio-group v-model="mycusForm.src">
					<el-form-item label="来源" prop="src">
					  <el-radio label="线索">线索</el-radio>
					  <el-radio label="工商">工商</el-radio>
					  <el-radio label="渠道">渠道</el-radio>
					  <el-radio label="其他">其他</el-radio>
					</el-form-item>
				</el-radio-group>
			<el-col>
		</el-row>
 		<el-row :gutter="20">
			<el-col :span="24">
				<el-radio-group v-model="mycusForm.status">
					<el-form-item label="状态" prop="status">
					  <el-radio label="未签约" :disabled="mycusForm.status=='已流转'">未签约</el-radio>
					  <el-radio label="已跟踪" :disabled="mycusForm.status=='已流转'">已跟踪</el-radio>
					  <el-radio label="已面访" :disabled="mycusForm.status=='已流转'">已面访</el-radio>
					  <el-radio label="已签约" :disabled="mycusForm.status=='已流转'">已签约</el-radio>
					  <el-radio label="已流转" :disabled="true">已流转</el-radio>
					</el-form-item>
				</el-radio-group>
			<el-col>
		</el-row>
		<el-row :gutter="20" v-show="mycusForm.status == '已签约' || mycusForm.status == '已流转' ">
			<el-col :span="24">
				<el-radio-group v-model="mycusForm.signtype">
					<el-form-item label="签约方式" prop="signtype">
					  <el-radio label="新签">新签</el-radio>
					  <el-radio label="续签">续签</el-radio>
					  <el-radio label="转介绍">转介绍</el-radio>
					</el-form-item>
				</el-radio-group>
			<el-col>
		  <el-col :span="8">
			<el-form-item label="成交金额" prop="amount">
				<el-input v-model.number="mycusForm.amount" @blur="compute_blance" maxlength="6"></el-input>
			</el-form-item>
		  </el-col>
		  <el-col :span="8">
			<el-form-item label="实际收款" prop="actualcollection">
				<el-input v-model.number="mycusForm.actualcollection" @blur="compute_blance" maxlength="6"></el-input>
			</el-form-item>
		  </el-col>
		  <el-col :span="8">
			<el-form-item label="尾款金额" prop="balance">
				<el-input v-model.number="mycusForm.balance"  maxlength="6"></el-input>
			</el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			<el-form-item label="尾款条件" prop="balancecondtion" v-show="mycusForm.balance > 0 && (mycusForm.status == '已签约'  || mycusForm.status == '已流转') ">
				<el-input v-model="mycusForm.balancecondtion"  maxlength="250"></el-input>
			</el-form-item>
		  </el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
				<el-form-item label="备注模板" >
					<el-select placeholder="请选择" filterable @change="templatechange">
					  <el-option
						v-for="item in templates"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
				</el-form-item>
		  </el-col>
		  <el-col :span="24">
			  <el-form-item label="备注" prop="memo"  >
				  <el-input v-model="mycusForm.memo" maxlength="250"></el-input>
			  </el-form-item>
		  </el-col>
		</el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="cofirm" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>
<el-dialog :close-on-click-modal="false"  title="跟踪信息" :visible.sync="dialogTrackFormVisible" width="550px">
    <el-form :model="trackForm"  :rules="trackRules"  ref="trackForm" label-width="80px">
		<el-row :gutter="20" v-show="false">
			<el-col :span="24">
				<el-form-item label="事项" prop="tracktype">
				<el-select v-model="trackForm.tracktype" >
				  <el-option
					v-for="item in trackForm.tracktypes"
					:key="item"
					:label="item"
					:value="item">
				  </el-option>
				</el-select>
				</el-form-item>
			<el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
				<el-form-item label="跟踪模板" prop="template">
					<el-select v-model="trackForm.template" placeholder="请选择" filterable @change="trackchange">
					  <el-option
						v-for="item in templates"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
				</el-form-item>
		  </el-col>
		  <el-col :span="24">
			<el-form-item label="跟踪内容" prop="content">
				<el-input v-model="trackForm.content"  maxlength="100"></el-input>
			</el-form-item>
		  </el-col>
		</el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTrackFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="trackSubmit" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>
<el-dialog :close-on-click-modal="false"  title="客户转移" :visible.sync="dialogMoveFormVisible" width="350px">
    <el-form :model="moveForm" ref="moveForm" label-width="80px">
		<el-row :gutter="20">
			<el-col :span="24">
				<el-radio-group v-model="moveForm.target">
					<el-form-item label="转移到:" prop="target">
					  <el-radio label="公共客户">公共客户</el-radio>
					  <el-radio label="跟踪者">跟踪者</el-radio>
					</el-form-item>
				</el-radio-group>
			<el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="24">
				<el-form-item label="跟踪者" prop="trackerid" v-show="moveForm.target=='跟踪者'">
				<el-select v-model="moveForm.trackerid" filterable>
				  <el-option
					v-for="item in users"
					:key="item.id"
					:label="item.name"
					:value="item.id">
				  </el-option>
				</el-select>
				</el-form-item>
			<el-col>
		</el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogMoveFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="moveto" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>

<el-dialog :close-on-click-modal="false"  title="批量添加" :visible.sync="dialogBatchFormVisible" width="350px">
	<p>您可以选择成立日期范围，从范围日期内的公共客户中一次批量随机添加100个客户。</p>
	<p>您也不可以选择成立日期范围，从所有公共客户中一次批量随机添加100个客户。</p>
	<p>注：每天只能添加500个客户。</p>
    <el-form :model="batchForm" ref="batchForm" label-width="80px">
		<el-form-item label="成立日期" prop="founddate" >
			<el-date-picker style="width:235px"
				value-format="yyyy-MM-dd"
				  v-model="batchForm.founddate"
				  type="daterange"
				  width="100"
				  align="right"
				  unlink-panels
				  range-separator="至"
				  start-placeholder="开始日期"
				  end-placeholder="结束日期"
				  :picker-options="pickerOptions">
			</el-date-picker>
		</el-form-item>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogBatchFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="addbatch" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>


<el-dialog :close-on-click-modal="false"  title="批量分类" :visible.sync="dialogTypeFormVisible" width="350px">
    <el-form :model="typeForm" ref="typeForm" label-width="80px">
		<el-row :gutter="20">
		  <el-col :span="24">
			<el-radio-group v-model="typeForm.saletype">
				<el-form-item label="客户类别" prop="saletype">
				  <el-radio label="A">A</el-radio>
				  <el-radio label="B">B</el-radio>
				  <el-radio label="C">C</el-radio>
				  <el-radio label="无">无</el-radio>
				</el-form-item>
			</el-radio-group>
		</el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTypeFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="typeto" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>

<el-dialog :close-on-click-modal="false"  title="工商、税务办理流转单信息" :visible.sync="dialogTransFormVisible" width="1200px">
    <el-form :model="transForm" :rules="transRules" ref="transForm" label-width="130px">
		<el-tabs :value="tabvalue">
		  <el-tab-pane label="基础信息" name="base">
			<el-row :gutter="20">
			  <el-col :span="8">
				  <el-form-item label="销售" prop="sellerid"  >
					<el-select v-model="transForm.sellerid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
			  </el-col>
			  <el-col :span="8">
				<el-form-item label="出单人" prop="outformerid">
					<el-select v-model="transForm.outformerid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				</el-form-item>
			  </el-col>
			  <el-col :span="8">
				  <el-form-item label="交接人" prop="handoverid"  >
					<el-select v-model="transForm.handoverid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="8">
				  <el-form-item label="收款日期" prop="collectiondate"  >
					<el-date-picker
					value-format="yyyy-MM-dd"
					  v-model="transForm.collectiondate"
					  type="date"
					  placeholder="选择日期">
					</el-date-picker>
				  </el-form-item>
			  </el-col>
			  <el-col :span="8">
				<el-form-item label="流转日期" prop="transdate">
					<el-date-picker
					value-format="yyyy-MM-dd"
					  v-model="transForm.transdate"
					  type="date"
					  placeholder="选择日期">
					</el-date-picker>
				</el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="8">
				  <el-form-item label="公司名称" prop="compname"  >
					  <el-input v-model="transForm.compname" maxlength="50" :disabled="true"></el-input>
				  </el-form-item>
			  </el-col>
			  <el-col :span="8">
				<el-form-item label="区域" prop="area">
					<el-input v-model="transForm.area"  maxlength="50" :disabled="true"></el-input>
				</el-form-item>
			  </el-col>
			  <el-col :span="8">
				  <el-form-item label="法人" prop="legalperson"  >
					  <el-input v-model="transForm.legalperson" maxlength="20" :disabled="true"></el-input>
				  </el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="8">
				  <el-form-item label="联系人" prop="contacter"  >
					  <el-input v-model="transForm.contacter" maxlength="20" :disabled="true"></el-input>
				  </el-form-item>
			  </el-col>
			  <el-col :span="8">
				<el-form-item label="联系电话" prop="phone">
					<el-input v-model="transForm.phone"  maxlength="20" :disabled="true"></el-input>
				</el-form-item>
			  </el-col>
			  <el-col :span="8">
				<el-form-item label="地址类别" prop="addresstype">
					<el-select v-model="transForm.addresstype">
					  <el-option
						v-for="item in addresstypes"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
				</el-form-item>
			</el-row>
			<el-row :gutter="20">
				<el-col :span="8">
					<el-form-item label="开票类别" prop="invoicingtype">
					<el-select v-model="transForm.invoicingtype">
					  <el-option
						v-for="item in invoicingtypes"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="8">
				  <el-form-item label="开票金额" prop="amountinvoicing">
					  <el-input v-model="transForm.amountinvoicing" ></el-input>
				  </el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="税务类别" prop="taxtype">
					<el-select v-model="transForm.taxtype">
					  <el-option
						v-for="item in taxtypes"
						:key="item"
						:label="item"
						:value="item">
					  </el-option>
					</el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="20">
				<el-col :span="8">
				  <el-form-item label="支付方式" prop="paytype">
					  <el-input v-model="transForm.paytype" ></el-input>
				  </el-form-item>
				</el-col>
				  <el-col :span="8">
					<el-form-item label="来源" prop="src">
						<el-select v-model="transForm.src">
						  <el-option
							v-for="item in sources"
							:key="item"
							:label="item"
							:value="item">
						  </el-option>
						</el-select>
					</el-form-item>
				  </el-col>
				  <el-col :span="8">
					<el-form-item label="签约方式" prop="signtype">
						<el-select v-model="transForm.signtype">
						  <el-option
							v-for="item in signtypes"
							:key="item"
							:label="item"
							:value="item">
						  </el-option>
						</el-select>
					</el-form-item>
				  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="6">
				  <el-form-item label="主管" prop="supervisorid"  >
					<el-select v-model="transForm.supervisorid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
			  </el-col>
			  <el-col :span="6">
				  <el-form-item label="财务" prop="financeid"  >
					<el-select v-model="transForm.financeid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
			  </el-col>
			  <el-col :span="6">
				  <el-form-item label="接收人" prop="receiverid"  >
					<el-select v-model="transForm.receiverid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="24">
				  <el-form-item label="备注" prop="memo"  >
					  <el-input v-model="transForm.memo" type="textarea" ></el-input>
				  </el-form-item>
			  </el-col>
			</el-row>
		</el-tab-pane>
		<el-tab-pane label="办理业务" name="business">
			<el-row :gutter="20">
			  <el-col :span="8">
				<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addService()">添加业务</el-button>
			  </el-col>
			  <el-col :span="24">
				  <el-table
						border
						:data="transForm.service"
						ref="multipleTable"
						tooltip-effect="dark"
						size="mini"
						height="150"
						style="width: 100%;">
						<el-table-column
						v-for="column in servicecolums"
						  v-bind:prop="column.prop"
						  v-bind:label="column.label"
						  v-bind:min-width="column.width"
						  show-overflow-tooltip>
						</el-table-column>
						 <el-table-column label="操作" min-width="50">
							  <template slot-scope="scope">
								  <el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
									<el-link type="primary" icon="el-icon-edit" @click="editService(scope.$index, scope.row)"></el-link>
								  </el-tooltip>
								 <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
									<el-link type="danger" icon="el-icon-delete" @click="delService(scope.$index, scope.row)"></el-link>
								  </el-tooltip>
							  </template>
						</el-table-column>
				  </el-table>
			  </el-col>
			</el-row>

			<el-row :gutter="20" style="margin-top: 20px;">
				<el-col :span="24" >
					<el-form-item label="优惠单">
						<el-select v-model="transForm.discount_id" @change="dicountChange" filterable>
							<el-option v-for="item in discountlist" :key="item.id" :label="item.preferentialDescription" :value="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="24">
				  <el-form-item label="赠送情况" prop="gifts"  >
					  <el-input v-model="transForm.gifts" type="textarea"></el-input>
				  </el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20">
			  <el-col :span="6">
				  <el-form-item label="总计费用" prop="amounttotal"  >
					  <el-input v-model="transForm.amounttotal" ></el-input>
				  </el-form-item>
			  </el-col>
			  <el-col :span="6">
				  <el-form-item label="应收" prop="amountreceivables"  >
					  <el-input v-model="transForm.amountreceivables" ></el-input>
				  </el-form-item>
			  </el-col>
			  <el-col :span="6">
				  <el-form-item label="实收" prop="amountpayin"  >
					  <el-input v-model="transForm.amountpayin" ></el-input>
				  </el-form-item>
			  </el-col>
			  <el-col :span="6">
				  <el-form-item label="尾款" prop="amountend"  >
					  <el-input v-model="transForm.amountend" ></el-input>
				  </el-form-item>
			  </el-col>
			  </el-row>
			  <el-row :gutter="20">
			  <el-col :span="24">
				  <el-form-item label="尾款条件" prop="amountendcondition"  >
					  <el-input v-model="transForm.amountendcondition" type="textarea"></el-input>
				  </el-form-item>
			  </el-col>
			</el-row>
			<el-row :gutter="20" >
			  <el-col :span="8">
				<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addRecorder()">添加收款记录</el-button>
			  </el-col>
			  <el-col :span="24">
				  <el-table
						border
						:data="transForm.recorder"
						ref="multipleTable"
						tooltip-effect="dark"
						size="mini"
						height="150"
						style="width: 100%;">
						<el-table-column
						v-for="column in transformpayrecorder"
						  v-bind:prop="column.prop"
						  v-bind:label="column.label"
						  v-bind:min-width="column.width"
						  show-overflow-tooltip>
						</el-table-column>
						 <el-table-column label="操作" min-width="50">
							  <template slot-scope="scope">
								  <el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
									<el-link type="primary" icon="el-icon-edit" @click="editRecorder(scope.$index, scope.row)"></el-link>
								  </el-tooltip>
								 <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
									<el-link type="danger" icon="el-icon-delete" @click="delRecorder(scope.$index, scope.row)"></el-link>
								  </el-tooltip>
							  </template>
						</el-table-column>
				  </el-table>
			  </el-col>
			</el-row>
		</el-tab-pane>
		<el-tab-pane label="上传材料" name="materials">
			<el-row :gutter="20">
				<el-col :span="24">
					<el-checkbox-group v-model="transForm.materials">
						<el-form-item label="相关材料" prop="materials">
						  <el-checkbox v-for = "item in materialslist" :label="item">{{item}}</el-checkbox>
						</el-form-item>
					</el-checkbox-group>
					<el-upload
					  class="avatar-uploader"
					  ref="upload"
					  multiple
					  :limit="1"
					  accept=".zip,.rar"
					  :file-list="transForm.annex"
					  :action="uploadurl + transForm.mycustomerid"
					  :headers="headers"
					  list-type="text"
					  :on-preview="handledownloadPreview"
					  :on-remove="handleRemove"
					  :on-success="handleAvatarSuccess"
					  :before-upload="beforeAvatarUpload">
					  <i class="el-icon-plus">点击上传相关材料的压缩文件（.zip或者.rar）</i>
					</el-upload>
				</el-col>
			</el-row>
		</el-tab-pane>
		</el-tabs>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTransFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="transto" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>
<el-dialog :close-on-click-modal="false"  title="服务信息" :visible.sync="dialogTransFormDetailVisible" width="1000px">
    <el-form :model="transFormDetail" :rules="transFormDetailRules" ref="transFormDetail" label-width="80px">
		<el-row :gutter="20">
			<el-col :span="8">
				<el-form-item label="服务名称" prop="name" >
				<el-select v-model="transFormDetail.name" filterable @change="servicechange">
				  <el-option
					v-for="item in services"
					:key="item.id"
					:label="item.name"
					:value="item.id">
				  </el-option>
				</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="规格" prop="spec" >
					<span>{{transFormDetail.spec}}</span>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="类别" prop="type" >
					<span>{{transFormDetail.type}}</span>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="8">
				<el-form-item label="数量" prop="amount" >
					<el-input v-model="transFormDetail.amount" ></el-input>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="单位" prop="unit" >
					<span>{{transFormDetail.unit}}</span>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="单价" prop="price" >
					<span>{{transFormDetail.price}}</span>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="8">
				<el-form-item label="成本金额" prop="cost" v-show="false">
					<el-input v-model="transFormDetail.cost" ></el-input>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="服务金额" prop="totalprice" >
					<el-input v-model="transFormDetail.totalprice" ></el-input>
				</el-form-item>
			</el-col>
			<el-col :span="8">
				<el-form-item label="备注" prop="memo" >
					<el-input v-model="transFormDetail.memo" ></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			  <el-table
					border
					:data="transFormDetail.service"
					ref="transFormDetailTable"
					tooltip-effect="dark"
					size="mini"
					height="200"
					@row-click="serviceDetailClick"
					style="width: 100%;">
					<el-table-column
					v-for="column in detailcolums"
					  v-bind:prop="column.prop"
					  v-bind:label="column.label"
					  v-bind:min-width="column.width"
					  show-overflow-tooltip>
					</el-table-column>
			  </el-table>
		  </el-col>
		</el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTransFormDetailVisible = false">取 消</el-button>
    <el-button type="primary" @click="confirmService" :disabled="submitDisable">确 定</el-button>
  </div>
</el-dialog>
<el-dialog :visible.sync="downloadDialogVisible">
  <a :href="downloadUrl">下载</a>
</el-dialog>
<el-dialog :close-on-click-modal="false"  title="收款信息" :visible.sync="transFormRecorderVisible" width="500px">
    <el-form :model="transFormRecorder" :rules="transFormRecorderRules" ref="transFormRecorder" label-width="80px">
		<el-row :gutter="20">
		  <el-col :span="12">
			  <el-form-item label="收款金额" prop="totalprice"  >
				  <el-input v-model="transFormRecorder.totalprice" maxlength="8"></el-input>
			  </el-form-item>
		  </el-col>
	   </el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
				<el-form-item label="收款方式" prop="loantype">
					<el-select v-model="transFormRecorder.loantype" filterable>
						<el-option v-for="item in loantypes" :key="item" :label="item" :value="item">
						</el-option>
					</el-select>
				</el-form-item>
		  </el-col>
	   </el-row>
		<el-row :gutter="20">
			  <el-col :span="24">
				  <el-form-item label="收款人" prop="reciverid"  >
					<el-select v-model="transFormRecorder.reciverid" filterable>
					  <el-option
						v-for="item in users"
						:key="item.id"
						:label="item.name"
						:value="item.id">
					  </el-option>
					</el-select>
				  </el-form-item>
		  		</el-col>
	    </el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
				<el-form-item label="收款日期" prop="collectiondate">
					<el-date-picker
					value-format="yyyy-MM-dd"
					  v-model="transFormRecorder.collectiondate"
					  type="date"
					  placeholder="选择日期">
					</el-date-picker>
				</el-form-item>
		  </el-col>
	   </el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			  <el-form-item label="备注" prop="memo"  >
				  <el-input v-model="transFormRecorder.memo" maxlength="250"></el-input>
			  </el-form-item>
		  </el-col>
	   </el-row>
		<el-row :gutter="20">
		  <el-col :span="24">
			<el-form-item label="收款截图" prop="annex">
				<el-upload class="avatar-uploader" ref="upload"
						   multiple :limit="1"
						   :file-list="transFormRecorder.annex"
						   :action="uploadrecorderurl + transForm.mycustomerid"
				 :headers="headers" list-type="text" :on-preview="handledownloadPreview4annex"
				 :on-success="handleAvatarSuccess4annex" :before-upload="beforeAvatarUpload">
					<i class="el-icon-plus">点击上传</i>
				</el-upload>
			</el-form-item>
		  </el-col>
		</el-row>
   </el-form>

  <div slot="footer" class="dialog-footer">
    <el-button @click="transFormRecorderVisible = false">取 消</el-button>
    <el-button type="primary" @click="confirmRecorder">确 定</el-button>
  </div>
</el-dialog>
</template>
</div>
</body>

<script src="./js/mycustomer.js?v=0.8.0.3"></script>

</html>
